<template>
    <el-dialog
            title="导出数据"
            class="edExport dialog-footer-top-border titleWeightBold"
            custom-class="dialogBox"
            :close-on-click-modal="false"
            @close="close"
            :visible.sync="dialogVisible"
            width="600px">
        <div class="edExportBox">
            <p>
                导出第
                <el-input size="small" style="" @input="check_num('stare')" v-model="form.page" ></el-input>
                页到
                <el-input @input="check_num('end')" size="small" v-model="form.endPage"></el-input>页
            </p>
            <p>共{{dataApi.pages ? dataApi.pages : 0}}页查询结果</p>
        </div>
        <span slot="footer" class="dialog-footer">
                <el-button @click="close" class="el-button-primary-no">取&nbsp;&nbsp;消</el-button>
                <el-button type="primary" class="el-button-primary-style marginLeft8" @click="down">确&nbsp;&nbsp;定</el-button>
            </span>
    </el-dialog>
</template>

<script>
    import {edExportRequest} from "src/api/resources";
    export default {
        name: "EdExport",
        props:{
            dataApi:{
                type:Object,
                required:false
            }
        },
        data(){
            return{
                dialogVisible:true,
                form:{
                    page:null,
                    endPage:null
                },
                dataForm:{}
            }
        },
        mounted() {
            this.dataForm= this.dataApi.copy();
            this.form.page = 1;
            this.form.endPage = this.dataApi.pages;
        },
        methods:{
            check_num(str){
                let page = String(this.form.page).replace(/[^\d]/g, '');
                let endPage = String(this.form.endPage).replace(/[^\d]/g, '');
                if(str == "stare"){
                    if(Number(page) > Number(endPage)){
                        this.$message.info({
                            message: '开始页必须小于等于结束页',
                            duration: 2000,
                            center:true
                        });
                        this.$set(this.form,"page","")
                    }
                }else if(str == "end"){
                    if(Number(page) > Number(endPage)){
                        this.$message.info({
                            message: '结束页必须大于等于开始页',
                            duration: 2000,
                            center:true
                        });
                        this.$set(this.form,"endPage","")
                    }
                }
            },
            down(){
                if(this.form.page && this.form.endPage){
                    if(this.dataApi.villageName){
                        this.dataForm.villageName = this.dataApi.villageName;
                    }

                    this.dataForm.page = Number(this.form.page);
                    this.dataForm.endPage = Number(this.form.endPage);
                    this.downExportExcel(this.dataForm,this.dataApi.url,'post')
                }else {
                    this.$message.info({
                        message: '请输入导出页数',
                        duration: 2000,
                        center:true
                    });
                }

            },
            downExportExcel(data,url,r){
                edExportRequest(data,url,r).then(response => {
                    this.$emit("exportSuccess",{})
                })
            },
            close(){
                this.$emit("exportSuccess",{})
            }
        }
    }
</script>

<style lang="scss">
.edExport{
    .edExportBox{
        .el-input{
            width: 80px;margin: 0 5px
        }
        .el-button{
            float: right;
        }
    }
    .el-dialog__body{
        padding: 15px 20px;
    }
}
</style>